<%@ taglib prefix="c" uri="http://www.codecoord.com" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <title>治疗建议</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/live_meeting.css">
    <script src="${pageContext.request.contextPath}/static/jquery/jquerymin.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/src/css/layui.css">
    <script src="${pageContext.request.contextPath}/static/layui/src/layui.js"></script>
    <script src="${pageContext.request.contextPath}/static/bootstrap/js/bootstrap-min.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrap.css">
    <script src="${pageContext.request.contextPath}/static/js/axios-min.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/app.css">
    <style>
        body {
            background: #f5f5f5;

        }

        #navbar-default {
            background-color: #71BD71;
        }
        .aui-footer-fixed{
            display: none;
        }
    </style>
</head>
<body>
<div id="header">
    <nav id="navbar-default" class="navbar navbar-default top-nabar" role="navigation"
         style="overflow:hidden;position:fixed;top:0;width:100%;z-index:1002;border: 0">
        <div class="row">
            <div class="container-fluid" id="fluid">
                <div class="col-lg-1 col-md-1 col-xs-1 col-sm-1" style=";padding-left: 6px;">
                    <a class="navbar-brand" href="javascript:history.back(-1)"
                       style="padding-left: 3px;">
                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                    </a>
                </div>
            </div>
        </div>
    </nav>
    <br><br>
</div>
<!-- banner -->
<form class="layui-form" action="">
    <div class="nimen_nimen">
        <ul>
            <li>
                <p>会议标题</p>
                <input type="text" value="${appointmentCase[0].title}" disabled="disabled">
                <div class="img_sfe"><img src="${pageContext.request.contextPath}/resource/images/right_jt.png" alt="">
                </div>
            </li>
        </ul>
        <ul class="ul_1">
            <li class="ul_1">
                <p>我的姓名</p>
                <input type="text" placeholder="请输入您的姓名" value="${Login.name}" disabled="disabled">

            </li>
            <li class="ul_1">
                <p>联系方式</p>
                <input type="text" placeholder="您的手机号码" value="${Login.phone}" disabled="disabled">

            </li>
            <li class="ul_1" style="position: relative">
                <p>病例文件</p>
                <c:forEach items="${appointmentCase}" var="appointmentCase" varStatus="status">
                    <a href="javascript:void(0) " class="a_1_1" id="${status.index}" style="display: none">${appointmentCase.fileName}</a>
                </c:forEach>
            </li>
            <li class="ul_1">
                <p>会诊专家</p>
                <input type="text" placeholder="" value="${appointmentUser.appointUser}" disabled="disabled">

            </li>
            <li class="ul_1" onclick="tipss(1)">
                <p>会诊医院</p>
                <input id="input_1" type="text" placeholder="" value="${appointmentUser.appointHospital}"
                       style="font-size: .20rem;word-wrap: break-word;;" disabled="disabled">
            </li>
        </ul>
        <ul id="ul_1">
            <li id="li_1">
                <p>选择病例</p>
                <div class="layui-input-block" style="margin-left: 23%">
                    <select id="sss" name="interest" lay-filter="bingli">
                        <c:forEach items="${appointmentCase}" var="appointmentCase" varStatus="status">
                            <option id="se_${status.index}" value="${appointmentCase.id}">病例${status.index+1}</option>
                        </c:forEach>
                    </select>
                </div>

            </li>
        </ul>

        <ul>
            <li>
                <p class="nomi" style="width: 43%">病例描述及治疗建议</p>
                <div class="img_sfe"><img id="tips" style="width: .33rem;"
                                          src="${pageContext.request.contextPath}/resource/images/yiwen.png" alt=""
                                          onclick="tipss(2)"></div>
            </li>
            <li class="nimen_fe" style="height: 160px">
                <div class="layui-form-item layui-form-text">
                    <div class="layui-input-block" style="margin-left: 0;">
                        <textarea name="desc" placeholder="请输入病例描述" class="layui-textarea text_1" maxlength="500" style="min-height: 120px"></textarea>
                    </div>
                </div>
            </li>
            <li class="nimen_fe" style="height: 220px;position: relative">
                <%--<i class="layui-icon layui-icon-close" onclick="enterOne(0)"></i>
                <button id="button_3" type="button" class="layui-btn layui-btn-warm layui-btn-radius layui-anim layui-anim-up" style="display: none">确定</button>--%>
                <%--<div class="layui-input-block select_1">//弃用
                    <select id="select_1" name="interest" lay-filter="jianyi">
                    </select>
                </div>--%>
                <span id="advive_p">治疗建议(专家名:建议)</span>
                <div class="layui-form-item layui-form-text">
                    <div class="layui-input-block" style="margin-left: 0;">
                        <textarea name="desc" placeholder="请输入专家建议" class="layui-textarea text_2" maxlength="500"
                                  style="min-height: 180px"></textarea>
                        <%--<i class="layui-icon layui-icon-close" onclick="enterOne(1)"></i>
                        <button id="button_4" type="button" class="layui-btn layui-btn-warm layui-btn-radius layui-anim layui-anim-up" style="display: none">确定</button>--%>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</form>
<div class="zy_goods_foot dis_flex" style="height: 50px;padding-bottom: 15px">
    <div class="left">
        <div><b><em></em></b></div>
        <div class="tou_d"></div>
    </div>
    <p style="height: 40px"><a href="javascript:;" onclick="submitProposal()" style="padding-top: 12px">添加建议</a></p>
</div>
<div style="height: 40px"></div>
<footer class="aui-footer aui-footer-fixed">

    <a href="/boke/index.jsp" class="aui-tabBar-item " style="text-decoration:none;">
        <span class="aui-tabBar-item-icon"><i class="icon icon-loan"></i></span>
        <span class="aui-tabBar-item-text">首页</span></a>

    <a href="/bokehall/hall/allHall" class="aui-tabBar-item aui-tabBar-item-active">
        <span class="aui-tabBar-item-icon"><i class="icon icon-credit"></i></span>
        <span class="aui-tabBar-item-text">会诊</span></a>

    <a href="/boke/msg/chatfriend.jsp" class="aui-tabBar-item ">
        <span class="aui-tabBar-item-icon"><i class="icon icon-ions"></i></span>
        <span class="aui-tabBar-item-text">消息</span></a>

    <a href="/boke/me.jsp" class="aui-tabBar-item "><span
            class="aui-tabBar-item-icon"><i class="icon icon-mine"></i></span>
        <span
                class="aui-tabBar-item-text">我的
        </span></a>
</footer>
</body>
<script>
    $(document).ready(function () {
        $("#header").hide();
        file();
        seachforeach();
        Doctor();

    })

    //?点击时的tip
    function tipss(index) {
        if(index==2){
            layer.tips('填写病例简述及后续检查、治疗、用药等建议', '#tips', {
                tips: [1, '#55C9B9']
            });
        }else{
            layer.tips('${appointmentUser.appointHospital}', '#input_1', {
                tips: [1, '#55C9B9'],
                time: 5000
            });
        }
    }

    //修改病例选择框同时改变对应病例文件显示
    function file() {
        $(".ul_1 a").css('display', 'none')
        let index = $("#sss").prop('selectedIndex');
        $('#' + index).css('display', 'block');
    }

    /*监听病例选择框变化*/
    layui.use(['form'], function () {
        var form = layui.form;
        form.on('select(bingli)', function (data) {
            file();
            seachforeach();
        });
    })

    //提交填写的治疗建议和病例内容
    function submitProposal() {
        /*获取当前选择病例的id*/
        let options = $("#sss").find("option:selected").val();
        let options2 = $("#select_1").find("option:selected").val();
        let formSubmit = new FormData();
        formSubmit.append("id", options);    //appointmentfiles表中的id(每个病例的id)
        formSubmit.append("expertAdvice", $(".text_1").val())
        formSubmit.append("caseDescription", $(".text_2").val())
        axios({
            method: 'post',
            url: '${pageContext.request.contextPath}/case/updateCase',
            data: formSubmit
        })
            .then(function (response) {
                if (response.data == 1) {
                    layer.msg('提交成功')
                    window.location.reload()
                } else {
                    layer.msg('提交失败', {icon: 5})
                    return false;
                }
            }).catch(function (error) {
            layer.msg('提交失败', {icon: 5})
            return false;
        })
    }
    //遍历所有病例内容并在选择病例时显示对应的病例内容和建议
    function seachforeach() {
        let index2 = $("#sss").prop('selectedIndex');
        let array = new Array();
        let b = 0;
        <c:forEach items="${appointmentCase}" var="appointmentCase">
        array.push({
            index: b,
            expertAdvice: '${appointmentCase.expertAdvice}',
            caseDescription: '${appointmentCase.caseDescription}'
        })
        b++;
        </c:forEach>
        $(".text_1").val(array[index2].expertAdvice)
        $(".text_2").val(array[index2].caseDescription);
    }
    //获取参会专家并存入下拉选
    function Doctor() {
        let dataList='${appointmentUser.appointUser}';
        let b= dataList.split(",")
        for (let i=0;i<b.length;i++){
            $("#select_1").append(new Option(b[i],b[i]));
        }
        layui.use(['form', 'upload', 'layer'],function() {
            layui.form.render("select");
        })
    }
    function enterOne(index){
        if(index==0){
            if($("#button_3").css("display") == "none"){
                $("#button_3").css('display','block');}
            else {
                $("#button_3").css('display','none');
            }
        }
        else{
            if($("#button_4").css("display") == "none"){
                $("#button_4").css('display','block');}
            else {
                $("#button_4").css('display','none');
            }
        }
    }

    $("#button_3").click(function () {
        $(".text_1").val("");
    })
    $("#button_4").click(function () {
        $(".text_2").val("");
    })
</script>
</html>
